<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>jquery的基本使用</title>
</head>
<body>
     <p class="box">111</p>
     <div id="span">222</div>
    <!-- 引入 -->
   <script src="./assets/js/jquery-3.7.1.min.js"></script> 
   <script>
   
    //当成功引入jQuery，页面有一个$对象
    // console.log($);
    // console.log(jQuery);
    // console.log($==jQuery);

    //获取元素

    //通过标签名获取元素
    // let p_list=document.getElementsByTagName('p')
    // console.log(p_list);
    //通过类名获取元素
    // let box=document.getElementsByClassName('box')
    // console.log(box);
    //通过id名获取元素
    // let span=document.getElementById('span');
    // console.log(span);



    //获取单个元素querySelector
    // 根据选择器：标签，类选择器，id选择器
    // let li =document.querySelector('li');
    // let box2 =document.querySelector('.box');
    // let span2 =document.querySelector('#span')

    //获取所有元素
    let all=document.querySelectorAll('选择器');


    // 数组遍历
    // for循环，while循环，do...while循环

    // 使用forEach
    // list.forEach((item,index) => {
    //     console.log(`${index}`);
    // })
// 例子：
//     let singer=['周杰伦','陈奕迅','毛不易 ','莫文蔚'];
//     singer.forEach((item,index) => {
//         // console.log(`${index}`);
//         console.log(`${item}`);
//     })




   </script>
</body> 
</html>